<!DOCTYPE html>
<!-- 
Template Name: Metronic - Responsive Admin Dashboard Template build with Twitter Bootstrap 3.0
Version: 1.5
Author: KeenThemes
Website: http://www.keenthemes.com/
Purchase: http://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469?ref=keenthemes
-->
<!--[if IE 8]> <html lang="en" class="ie8 no-js"> <![endif]-->
<!--[if IE 9]> <html lang="en" class="ie9 no-js"> <![endif]-->
<!--[if !IE]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
<!-- BEGIN HEAD -->
<head>
   <meta charset="utf-8" />
   <title>利导科技客户关系管理系统 | 员工登记</title>
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta content="width=device-width, initial-scale=1.0" name="viewport" />
   <meta content="" name="description" />
   <meta content="" name="author" />
   <meta name="MobileOptimized" content="320">
   <!-- BEGIN GLOBAL MANDATORY STYLES -->          
   <link href="${base}/assets/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
   <link href="${base}/assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
   <link href="${base}/assets/plugins/uniform/css/uniform.default.css" rel="stylesheet" type="text/css"/>
   <!-- END GLOBAL MANDATORY STYLES -->
   <!-- BEGIN PAGE LEVEL STYLES -->
    <!-- BEGIN PAGE LEVEL STYLES -->
   <link rel="stylesheet" type="text/css" href="${base}/assets/plugins/bootstrap-fileupload/bootstrap-fileupload.css" />
   <link rel="stylesheet" type="text/css" href="${base}/assets/plugins/gritter/css/jquery.gritter.css" />
   <link rel="stylesheet" type="text/css" href="${base}/assets/plugins/select2/select2_metro.css" />
   <link rel="stylesheet" type="text/css" href="${base}/assets/plugins/clockface/css/clockface.css" />
   <link rel="stylesheet" type="text/css" href="${base}/assets/plugins/bootstrap-wysihtml5/bootstrap-wysihtml5.css" />
   <link rel="stylesheet" type="text/css" href="${base}/assets/plugins/bootstrap-datepicker/css/datepicker.css" />
   <link rel="stylesheet" type="text/css" href="${base}/assets/plugins/bootstrap-timepicker/compiled/timepicker.css" />
   <link rel="stylesheet" type="text/css" href="${base}/assets/plugins/bootstrap-colorpicker/css/colorpicker.css" />
   <link rel="stylesheet" type="text/css" href="${base}/assets/plugins/bootstrap-daterangepicker/daterangepicker-bs3.css" />
   <link rel="stylesheet" type="text/css" href="${base}/assets/plugins/bootstrap-datetimepicker/css/datetimepicker.css" />
   <link rel="stylesheet" type="text/css" href="${base}/assets/plugins/jquery-multi-select/css/multi-select.css" />
   <link href="${base}/assets/plugins/bootstrap-switch/static/stylesheets/bootstrap-switch-metro.css" rel="stylesheet" type="text/css"/>
   <link rel="stylesheet" type="text/css" href="${base}/assets/plugins/jquery-tags-input/jquery.tagsinput.css" />
   <!-- END PAGE LEVEL STYLES -->
   <!-- BEGIN THEME STYLES --> 
   <link href="${base}/assets/css/style-metronic.css" rel="stylesheet" type="text/css"/>
   <link href="${base}/assets/css/style.css" rel="stylesheet" type="text/css"/>
   <link href="${base}/assets/css/style-responsive.css" rel="stylesheet" type="text/css"/>
   <link href="${base}/assets/css/plugins.css" rel="stylesheet" type="text/css"/>
   <link href="${base}/assets/css/themes/default.css" rel="stylesheet" type="text/css" id="style_color"/>
   <link href="${base}/assets/css/custom.css" rel="stylesheet" type="text/css"/>
   <!-- END THEME STYLES -->
   <link rel="shortcut icon" href="${base}/assets/img/favicon.ico" />
</head>
<!-- END HEAD -->
<!-- BEGIN BODY -->
<body class="page-header-fixed">
	<#include "header.ftl">
   <div class="clearfix"></div>
   <!-- BEGIN CONTAINER -->
   <div class="page-container">
      <!-- BEGIN SIDEBAR -->
      <#include "main_menu.ftl">
      <!-- END SIDEBAR -->
      <!-- BEGIN PAGE -->
      <div class="page-content">
         <#include "changePassword.ftl">
         <#include "system-set.ftl">
         <!-- BEGIN PAGE HEADER-->
		 <div class="row">
			<div class="col-md-12">
			   <!-- BEGIN PAGE TITLE & BREADCRUMB-->
			   <h3 class="page-title">
			      	新建员工 <small>登记员工的基本信息和系统登陆账号</small>
			   </h3>
			   <ul class="page-breadcrumb breadcrumb">
			      <li>
			         <i class="icon-home"></i>
			         <a href="${base}/admin/admin!main.action">Home</a> 
			         <i class="icon-angle-right"></i>
			      </li>
			      <li>
			         <a href="#">员工管理</a>
			         <i class="icon-angle-right"></i>
			      </li>
			      <li><a href="${base}/admin/employee!add.action">新建员工</li>
			   </ul>
			   <!-- END PAGE TITLE & BREADCRUMB-->
			</div>
		 </div>
		 <!-- END PAGE HEADER-->
		<!-- BEGIN PAGE CONTENT-->
		<div class="row">
            <div class="col-md-12">
               <!-- BEGIN VALIDATION STATES-->
               <div class="portlet box blue">
                  <div class="portlet-title">
                     <div class="caption"><i class="icon-reorder"></i>员工登记</div>
                     <div class="tools">
                        <a href="javascript:;" class="collapse"></a>
                        <a href="#portlet-config" data-toggle="modal" class="config"></a>
                        <a href="javascript:;" class="reload"></a>
                        <a href="javascript:;" class="remove"></a>
                     </div>
                  </div>
                  <div class="portlet-body form">
                     <!-- BEGIN FORM-->
                     <form action="${base}/admin/employee!save.action" id="form_employee" class="form-horizontal">
                        <div class="form-body">
                           <h3 class="form-section">员工基本信息</h3>
                           <div class="alert alert-danger display-hide">
                              <button class="close" data-dismiss="alert"></button>
                              	你的表单存在错误. 请检查后再次提交.
                           </div>
                           <div class="alert alert-success display-hide">
                              <button class="close" data-dismiss="alert"></button>
                              	表单验证成功!
                           </div>
                           <div class="row">
							   <div class="col-md-6">
							      <div class="form-group">
							         <label class="control-label col-md-3">员工姓名<span class="required">*</span></label>
			                         <div class="col-md-6">
			                            <input <#if employee.fullname?exists> value = "${employee.fullname}"</#if> name="fullname" id = "fullname" type="text" class="form-control"/>
			                         </div>
							      </div>
							   </div>
							   <div class="col-md-6">
                                  <div class="form-group">
                                     <label class="control-label col-md-3">性别<span class="required">*</span></label>
		                              <div class="col-md-6">
		                                 <select class="form-control" name = "gender" id = "gender" >
							               <option value=""></option>
							               <option <#if employee.gender?exists><#if employee.gender == "男"> selected = "selected" </#if></#if> value ="男">男</option>
							               <option <#if employee.gender?exists><#if employee.gender == "男"> selected = "selected" </#if></#if> value ="女">女</option>
							             </select>
		                              </div>
                                  </div>
                               </div>
							</div>
							<div class="row">
							   <div class="col-md-6">
							      <div class="form-group">
							         <label class="control-label col-md-3">年龄</label>
			                          <div class="col-md-6">
			                             <input <#if employee.age?exists> value = "${employee.age}"</#if> name="age" id = "age" type="text" class="form-control"/>
			                          </div>
							      </div>
							   </div>
							   <div class="col-md-6">
                                  <div class="form-group">
                                     <label class="control-label col-md-3">生日</label>
		                              <div class="col-md-6">
		                              	<div class="input-group date date-picker" >                                       
		                                    <input <#if employee.birthday?exists> value = "${employee.birthday}"</#if> type="text" size="16" readonly class="form-control" id = "birthday" name = "birthday">
		                                    <span class="input-group-btn">
		                                    <button class="btn default date-set" type="button"><i class="icon-calendar"></i></button>
		                                    </span>
		                                 </div>
		                                 
		                              </div>
                                  </div>
                               </div>
							</div>
                           <div class="row">
							   <div class="col-md-6">
							      <div class="form-group">
							         <label class="control-label col-md-3">手机号码</label>
		                              <div class="col-md-6">
		                                 <input <#if employee.telephone?exists> value = "${employee.telephone}"</#if> name="telephone" id = "telephone" type="text" class="form-control">
		                              </div>
							      </div>
							   </div>
							   <div class="col-md-6">
                                  <div class="form-group">
                                     <label class="control-label col-md-3">电话</label>
		                              <div class="col-md-6">
		                                 <input <#if employee.phone?exists> value = "${employee.phone}"</#if> name="phone" id = "phone" type="text" class="form-control">
		                              </div>
                                  </div>
                               </div>
							</div>
                           <div class="row">
							   <div class="col-md-6">
							      <div class="form-group">
							         <label class="control-label col-md-3">电子邮箱</label>
		                              <div class="col-md-6">
		                                 <input <#if employee.email?exists> value = "${employee.email}"</#if> name="email" id="email" type="text" class="form-control">
		                              </div>
							      </div>
							   </div>
							   <div class="col-md-6">
                                  <div class="form-group">
                                     <label class="control-label col-md-3">现住地址</label>
		                              <div class="col-md-6">
		                                 <input <#if employee.address?exists> value = "${employee.address}"</#if> name="address" id="address" type="text" class="form-control">
		                              </div>
                                  </div>
                               </div>
							</div>
							<div class="row">
							   <div class="col-md-6">
							      <div class="form-group">
							         <label class="control-label col-md-3">学历</label>
		                              <div class="col-md-6">
		                                 <input <#if employee.eduBackground?exists> value = "${employee.eduBackground}"</#if> name="eduBackground" id="eduBackground" type="text" class="form-control">
		                              </div>
							      </div>
							   </div>
							   <div class="col-md-6">
                                  <div class="form-group">
                                     <label class="control-label col-md-3">籍贯</label>
		                              <div class="col-md-6">
		                                 <input <#if employee.birthPlace?exists> value = "${employee.birthPlace}"</#if> name="birthPlace" id="birthPlace" type="text" class="form-control">
		                              </div>
                                  </div>
                               </div>
							</div>
							<div class="row">
							   <div class="col-md-6">
							      <div class="form-group">
							         <label class="control-label col-md-3">部门<span class="required">*</span></label>
		                              <div class="col-md-6">
		                                 <select class="form-control" name = "department" id = "department" >
							               <option value=""></option>
							               <#if departmentList?exists>
								               <#list departmentList as department>
								               	<option <#if employee.department.id == department.id>selected = "selected" </#if> value ="${department.id}">${department.name}</option>
								               </#list>
							               </#if>
							             </select>
		                              </div>
							      </div>
							   </div>
							   <div class="col-md-6">
                                  <div class="form-group">
                                     <label class="control-label col-md-3">职位<span class="required">*</span></label>
		                              <div class="col-md-6">
		                                 <select class="form-control" name = "position" id = "position" >
							               <option value=""></option>
							               <#if positionList?exists>
								               <#list positionList as position>
								               	<option <#if employee.position.id == position.id>selected = "selected"</#if> value ="${position.id}">${position.name}</option>
								               </#list>
							               </#if>
							             </select>
		                              </div>
                                  </div>
                               </div>
							</div>
							<div class="row">
							   <div class="col-md-6">
							      <div class="form-group">
							         <label class="control-label col-md-3">状态<span class="required">*</span></label>
		                              <div class="col-md-6">
		                                 <select class="form-control" name = "status" id = "status" >
							               <option value=""></option>
								               <option <#if employee.status?exists><#if employee.status == "在职">selected = "selected"</#if></#if> value ="在职">在职</option>
								               <option <#if employee.status?exists><#if employee.status == "实习">selected = "selected"</#if></#if> value ="实习">实习</option>
								               <option <#if employee.status?exists><#if employee.status == "离职">selected = "selected"</#if></#if> value ="离职">离职</option>
							             </select>
		                              </div>
							      </div>
							   </div>
							   <div class="col-md-6">
                                  <div class="form-group">
                                     <label class="control-label col-md-3">个人说明</label>
		                              <div class="col-md-6">
		                              	
		                                 <input <#if employee.persondesc?exists> value = "${employee.persondesc}"</#if> name="persondesc" id="persondesc" type="text" class="form-control">
		                              </div>
                                  </div>
                               </div>
							</div>
							<div class="row">
							   <div class="col-md-6">
							      <div class="form-group">
							         <label class="control-label col-md-3">入职日期</label>
		                              <div class="col-md-6">
		                              	<div class="input-group date date-picker" >                                       
		                                    <input <#if employee.employmentDate?exists> value = "${employee.employmentDate}"</#if> type="text" size="16" readonly class="form-control" id = "employmentDate" name = "employmentDate">
		                                    <span class="input-group-btn">
		                                    <button class="btn default date-set" type="button"><i class="icon-calendar"></i></button>
		                                    </span>
		                                 </div>
		                              </div>
							      </div>
							   </div>
							   <div class="col-md-6">
                                  <div class="form-group">
                                     <label class="control-label col-md-3">离职日期</label>
		                              <div class="col-md-6">
		                              	<div class="input-group date date-picker" >                                       
		                                    <input <#if employee.levelOffice?exists> value = "${employee.levelOffice}"</#if> type="text" size="16" readonly class="form-control" id = "levelOffice" name = "levelOffice">
		                                    <span class="input-group-btn">
		                                    <button class="btn default date-set" type="button"><i class="icon-calendar"></i></button>
		                                    </span>
		                                 </div>
		                              </div>
                                  </div>
                               </div>
							</div>
							<h3 class="form-section">账号信息</h3>
							<div class="row">
							   <div class="col-md-6">
							      <div class="form-group">
							         <label class="control-label col-md-3">登录账号</label>
		                              <div class="col-md-6">
		                                 <input <#if employee.loginname?exists> value = "${employee.loginname}"<#else> value = ""</#if> name="loginname" id="loginname" type="text" class="form-control">
		                              </div>
							      </div>
							   </div>
							   <div class="col-md-6">
                                  <div class="form-group">
                                     <label class="control-label col-md-3">密码</label>
		                              <div class="col-md-6">
		                                 <input <#if employee.password?exists> value = "${employee.password}"<#else> value = ""</#if> name="password" id="password" type="password" class="form-control">
		                              </div>
                                  </div>
                               </div>
							</div>
	                        <div class="form-actions fluid">
	                           <div class="col-md-offset-3 col-md-9">
	                              <button type="submit" class="btn green">提交</button>
	                              <button type="button" class="btn default">取消</button>                              
	                           </div>
	                        </div>
                       	</div> 
                     </form>
                     <!-- END FORM-->
                  </div>
               </div>
               <!-- END VALIDATION STATES-->
			   </div>
			</div>
		<!-- END PAGE CONTENT-->    
      </div>
      <!-- END PAGE -->	 
	</div>
	<!-- END CONTAINER -->
	<!-- BEGIN FOOTER -->
   <div class="footer">
      <div class="copyright">
		2014 &copy; 西南财经大学天府学院  | 袁金廷
	</div>
      <div class="footer-tools">
         <span class="go-top">
         <i class="icon-angle-up"></i>
         </span>
      </div>
   </div>
   <!-- END FOOTER -->
   <!-- BEGIN JAVASCRIPTS(Load javascripts at bottom, this will reduce page load time) -->
   <!-- BEGIN CORE PLUGINS -->
   <!--[if lt IE 9]>
   <script src="${base}/assets/plugins/respond.min.js"></script>
   <script src="${base}/assets/plugins/excanvas.min.js"></script> 
   <![endif]-->   
   <script src="${base}/assets/plugins/jquery-1.10.2.min.js" type="text/javascript"></script>
   <script src="${base}/assets/plugins/jquery-migrate-1.2.1.min.js" type="text/javascript"></script>
   <script src="${base}/assets/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
   <script src="${base}/assets/plugins/bootstrap/js/bootstrap2-typeahead.min.js" type="text/javascript"></script>
   <script src="${base}/assets/plugins/bootstrap-hover-dropdown/twitter-bootstrap-hover-dropdown.min.js" type="text/javascript" ></script>
   <script src="${base}/assets/plugins/jquery-slimscroll/jquery.slimscroll.min.js" type="text/javascript"></script>
   <script src="${base}/assets/plugins/jquery.blockui.min.js" type="text/javascript"></script>  
   <script src="${base}/assets/plugins/jquery.cookie.min.js" type="text/javascript"></script>
   <script src="${base}/assets/plugins/uniform/jquery.uniform.min.js" type="text/javascript" ></script>
   <!-- END CORE PLUGINS -->
   <!-- BEGIN PAGE LEVEL PLUGINS -->
   <script type="text/javascript" src="${base}/assets/plugins/jquery-validation/dist/jquery.validate.min.js"></script>
   <script type="text/javascript" src="${base}/assets/plugins/jquery-validation/dist/additional-methods.min.js"></script>
   <script type="text/javascript" src="${base}/assets/plugins/select2/select2.min.js"></script>
   <script type="text/javascript" src="${base}/assets/plugins/bootstrap-wysihtml5/wysihtml5-0.3.0.js"></script> 
   <script type="text/javascript" src="${base}/assets/plugins/bootstrap-wysihtml5/bootstrap-wysihtml5.js"></script>
   <script type="text/javascript" src="${base}/assets/plugins/ckeditor/ckeditor.js"></script>
   <script type="text/javascript" src="${base}/assets/plugins/fuelux/js/spinner.min.js"></script>
   <script type="text/javascript" src="${base}/assets/plugins/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
   <script type="text/javascript" src="${base}/assets/plugins/bootstrap-datetimepicker/js/bootstrap-datetimepicker.js"></script>
   <script type="text/javascript" src="${base}/assets/plugins/clockface/js/clockface.js"></script>
   <script type="text/javascript" src="${base}/assets/plugins/bootstrap-daterangepicker/moment.min.js"></script>
   <script type="text/javascript" src="${base}/assets/plugins/bootstrap-daterangepicker/daterangepicker.js"></script> 
   <script type="text/javascript" src="${base}/assets/plugins/bootstrap-colorpicker/js/bootstrap-colorpicker.js"></script>  
   <script type="text/javascript" src="${base}/assets/plugins/bootstrap-timepicker/js/bootstrap-timepicker.js"></script>
   <script type="text/javascript" src="${base}/assets/plugins/jquery-inputmask/jquery.inputmask.bundle.min.js"></script>   
   <script type="text/javascript" src="${base}/assets/plugins/jquery.input-ip-address-control-1.0.min.js"></script>
   <script type="text/javascript" src="${base}/assets/plugins/jquery-multi-select/js/jquery.multi-select.js"></script>
   <script type="text/javascript" src="${base}/assets/plugins/jquery-multi-select/js/jquery.quicksearch.js"></script>   
   <script src="${base}/assets/plugins/jquery.pwstrength.bootstrap/src/pwstrength.js" type="text/javascript" ></script>
   <script src="${base}/assets/plugins/bootstrap-switch/static/js/bootstrap-switch.min.js" type="text/javascript" ></script>
   <script src="${base}/assets/plugins/jquery-tags-input/jquery.tagsinput.min.js" type="text/javascript" ></script>
   <!-- END PAGE LEVEL PLUGINS -->
   <!-- BEGIN PAGE LEVEL STYLES -->
   <script src="${base}/assets/scripts/app.js"></script>
   <script src="${base}/resources/scripts/employee-validation.js"></script>
   <!-- END PAGE LEVEL STYLES -->    
   <script>
      jQuery(document).ready(function() {   
         // initiate layout and plugins
         App.init();
         EmployeeValidation.init();
         
         if (jQuery().datepicker) {
            $('.date-picker').datepicker({
                rtl: App.isRTL(),
                autoclose: true,
                format: "yyyy/mm/dd",
                pickerPosition: (App.isRTL() ? "bottom-right" : "bottom-left")
            });
            $('body').removeClass("modal-open"); // fix bug when inline picker is used in modal
        }
         
          /**
         	部门与职位之间的联动
         */
         $("#department").change(function(){
         	var departId = $(this).val();
				$.ajax({
			        type:"post",
			        url:"${base}/admin/position!findByDepartId.action",
			        dataType:"json",
			        data:"departId="+departId,
			        cache:false,
			        beforeSend:function(XMLHttpRequest){
			        },
			        success:function(json){
			        	result = json.result;
			        	if(result){
				        	positionList = json.positionList;
							//先清除旧数据,再添加
							$("#position option").each(function(i){
								if(i>0){
			            			$(this).remove();
			            		}
			            	});
							$(positionList).each(function(i){
					            $("#position").append( '<option value =  '+positionList[i].id+' >'+positionList[i].name+'</option>');
				    		});
			        	}else{
			        		alert("程序异常");
			        	}
			          
			        },
			       	complete:function(XMLHttpRequest,textStatus){
			       	},
			      	error:function(XMLHttpRequest,textStatus,errorThrown){
			      		alert("很抱歉,网络出错,请重试！");
			      	}
			    });
         });
      });
   </script>
   <!-- END JAVASCRIPTS -->
</body>
</html>